import React from 'react'
import { View, StyleSheet, Text } from 'react-native'
import { ScaleS, ScaleT } from 'src/utils/ScreenUtil'
import PropTypes from 'prop-types'

export default function TagView(props) {
  const { tagLabel, style, tagLabelStyle } = props
  return tagLabel ? (
    <View style={[styles.tagView].concat(style)}>
      <Text style={[styles.tagText].concat(tagLabelStyle)}>{tagLabel}</Text>
    </View>
  ) : null
}
TagView.propTypes = {
  tagLabel: PropTypes.string,
  style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
  tagLabelStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.array])
}

const styles = StyleSheet.create({
  tagView: {
    paddingHorizontal: ScaleS(16),
    height: ScaleS(28),
    backgroundColor: 'rgba(216,216,216,0.205)',
    borderRadius: ScaleS(5)
  },
  tagText: {
    fontSize: ScaleT(12),
    fontWeight: '400',
    color: '#666666',
    lineHeight: ScaleS(28)
  }
})
